<template>
    <div class="form">
        <el-dialog v-model="dialogVisible" :title="title" width="30%">
            <slot slot="body"></slot>
            <div slot="footer">
                <span class="dialog-footer">
                    <el-button @click="$emit('cancel')">取消</el-button>
                    <el-button type="primary" @click="$emit('confirm')">确定</el-button>
                </span>
            </div>
        </el-dialog>

        <!-- <el-dialog v-model="dialogVisible" :title="title" width="30%">
            <el-form :model="ruleForm" :rules="rules" class="demo-model">
                <el-form-item label="用户名" prop="username">
                    <el-input v-model="ruleForm.username" />
                </el-form-item>
                <el-form-item v-if="!ruleForm.id" label="密码" prop="password">
                    <el-input v-model="ruleForm.password" type="password" />
                </el-form-item>
                <el-form-item label="邮箱" prop="email">
                    <el-input v-model="ruleForm.email" />
                </el-form-item>
                <el-form-item label="电话" prop="mobile">
                    <el-input v-model="ruleForm.mobile" />
                </el-form-item>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="dialogVisible = false">取消</el-button>
                    <el-button type="primary" @click="confirm">确定</el-button>
                </span>
            </template>
        </el-dialog> -->
        <!-- <el-form ref="form" :model="data" status-icon class="demo-ruleForm">
                <el-form-item v-for="(item, index) in options" :key="index" :rules="item.rules" :prop="index"
                    :label="item.title">
                    <el-input  v-model="data[index]" :type="item.type" :placeholder="item.ph" />
                </el-form-item>
            </el-form> -->

    </div>
</template>
<script>
import { ref, reactive, toRefs, computed } from 'vue'
export default {
    props: {
        ruleForm: {
            type: Array,
            default: () => { }
        },
        rules: {
            type: Object,
            default: () => { }
        }, opts: {
            type: Object,
            required: true,
            default: () => { }
        },
        dialogVisible: {
            type: Boolean,
            default: true
        },
        title: {
            type: String
        }
    },
    setup(props) {

    }
}
</script>
<style lang="scss" scoped>
</style>